<!DOCTYPE html>
<html class="no-js" lang="zh_CN">

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">

    <title>${system_admin_title}</title>
    #required_css
</head>

<body>#loading
<div class="app $!layout">
    <!-- 头部菜单 -->
    #header
    <section class="layout">
        <!-- 菜单 -->
        #sidebar
        <!-- 内容主体 -->
        <section class="container">
            <section class="main-content">
                <!-- 主体操作栏 -->
                <header class="header navbar">
                    <!-- 左按钮区 -->
                    <div class="btn-group tool-button">
                        <a class="btn btn-primary navbar-btn" href="$!basePath/system/res"><i class="ti-angle-left"></i>
                            返回</a>
                    </div>
                </header>
                <div class="content-wrap">
                    <div class="wrapper">
                        <section class="panel pt20 pl20 pr20">
                            <form id="resAddForm" role="form" class="form-horizontal parsley-form" data-parsley-validate
                                  action="$!basePath/system/res/edit/do" method="post">
                                <input type="hidden" name="id" value="$!res.id"/>
                                <div class="row mb15">
                                    <div class="col-lg-12 col-md-12">
                                        <div class="form-group">
                                            <label for="parentId" class="col-sm-1 control-label">上级菜单</label>
                                            <div class="col-sm-10">
                                                <div class="input-group">
                                                    <input id="parentId" type="text" class="form-control"
                                                           placeholder="上级菜单，不选择默认为一级菜单" disabled value="$!parentName"/>
			                             		<span class="input-group-btn">
			                             			<button type="button" class="btn btn-primary" data-toggle="modal"
                                                            data-target="#dialogSelectParentMenu"><i
                                                            class="ti-plus"></i> 选择</button>
			                             		</span>
                                                </div>
                                                <input type="hidden" name="parentId" value="$!res.parentId">
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label for="name" class="col-sm-1 control-label">名称</label>
                                            <div class="col-sm-10">
                                                <input type="text" class="form-control" name="name"
                                                       data-parsley-required="true" placeholder="菜单名称"
                                                       value="$!res.name">
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label for="url" class="col-sm-1 control-label">URL地址</label>
                                            <div class="col-sm-10">
                                                <input type="text" name="url" class="form-control" placeholder="URL地址"
                                                       value="$!res.url">
                                                <p class="help-block no-m">例如：/system/res/add.</p>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label for="icon" class="col-sm-1 control-label">图标</label>
                                            <div class="col-sm-10">
                                                <div class="input-group">
                                                    <input id="icon" type="text" name="icon" class="form-control"
                                                           placeholder="图标样式" value="$!res.icon">
			                                 	<span class="input-group-btn">
			                             			<button type="button" class="btn btn-primary"
                                                            onclick="showIconSelect()"><i
                                                            class="ti-plus"></i> 选择</button>
			                             		</span>
                                                </div>
                                                <p class="help-block no-m">预览：<i id="iconPreview"
                                                                                 class="$!res.icon"></i>
                                                </p>
                                            </div>
                                        </div>
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group">
                                            <label for="descript" class="col-sm-1 control-label">描述</label>
                                            <div class="col-sm-10">
                                            <textarea name="descript" class="form-control"
                                                      rows="3">$!res.descript</textarea>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="row mb15">
                                    <div class="col-lg-3 col-md-3">
                                        <div class="form-group">
                                            <label for="enabled" class="col-sm-4 control-label">#springMessage('system.common.enable')</label>
                                            <div class="col-sm-6 switcha">
                                                <div class="mr15">
                                                    <input type="checkbox" name="enabled" class="js-switch-blue"
                                                           #if($!res.enabled)checked="checked" #end>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-3 col-md-3">
                                        <div class="form-group">
                                            <label for="enabled" class="col-sm-4 control-label">显示</label>
                                            <div class="col-sm-6 switcha">
                                                <div class="mr15">
                                                    <input type="checkbox" name="display" class="js-switch-blue"
                                                           #if($!res.display)checked="checked" #end>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-3 col-md-3">
                                        <div class="form-group">
                                            <label for="enabled" class="col-sm-4 control-label">新窗口</label>
                                            <div class="col-sm-6 switcha">
                                                <div class="mr15">
                                                    <input type="checkbox" name="newWindow" class="js-switch-blue"
                                                           #if($!res.newWindow)checked="checked" #end>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-3 col-md-3">
                                        <div class="form-group">
                                            <label for="enabled" class="col-sm-4 control-label">新功能</label>
                                            <div class="col-sm-6 switcha">
                                                <div class="mr15">
                                                    <input type="checkbox" name="beta" class="js-switch-blue"
                                                           #if($!res.beta)checked="checked" #end>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="col-lg-12 col-md-12 col-sm-12">
                                        <div class="hr-line-dashed"></div>
                                        <div class="form-group text-center">
                                            <div>
                                                <button class="btn btn-primary btn-form-submit btn-parsley"
                                                        data-loading-text="正在提交...">立即提交
                                                </button>
                                                <button type="reset" class="btn btn-default btn-outline">重置</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </form>
                        </section>
                    </div>
                </div>
                <a class="exit-offscreen"></a>
            </section>
            <!-- 选择上级菜单 -->
            <div id="dialogSelectParentMenu" class="modal fade bs-modal-sm" tabindex="-1" role="dialog" aria-hidden="true">
                <div class="modal-dialog">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                            <h4 class="modal-title">选择上级菜单</h4>
                        </div>
                        <div class="modal-body">
                            <div class="row">
                                <div class="col-xs-12">
                                    <div id="jsTreeParentMenu" class="demo"></div>
                                </div>
                            </div>
                        </div>
                        <div class="modal-footer">
                            <div class="pull-left">
                                <button type="button" class="btn btn-success" data-dismiss="modal" onclick="selectFirstMenu()">
                                    设为顶级菜单
                                </button>
                            </div>
                            <button type="button" class="btn btn-default" data-dismiss="modal">取 消</button>
                            <button type="button" class="btn btn-primary" onclick="selectParentMenu()">确认选择</button>
                        </div>
                    </div>
                </div>
            </div>
        </section>
    </section>
</div>
#required_js

<!-- 页面组件脚本 -->
<script src="$!basePath/framework/plugins/switchery/switchery.js"></script>

<!-- 本页面脚本 -->
<script src="$!basePath/framework/js/form/form.js"></script>
<script src="$!basePath/framework/js/view/toast.js"></script>
<script src="$!basePath/framework/js/view/tree.js"></script>
<script src="$!basePath/framework/js/form/validator.js"></script>
<script type="text/javascript">
    function initTreeView() {
        var tree = $("#jsTreeParentMenu").jstree({
            plugins: ["wholerow"],
            core: {
                data: {
                    url: function (node) {
                        return node.id === "#" ? "$!basePath/system/res/tree" : "$!basePath/system/res/tree/" + node.id
                    }
                },
                multiple: false
            }
        }).on("dblclick.jstree", function (node) {
            selectParentMenu();
        });
    }
    //选择父菜单
    function selectParentMenu() {
        var tree = $.jstree.reference("#jsTreeParentMenu");
        var node = tree.get_selected(true);
        $("#resAddForm #parentId").val(node[0].text);
        $("#resAddForm input[name='parentId']").val(node[0].id);
        $("#dialogSelectParentMenu").modal("hide");
    }
    function selectFirstMenu() {
        $("#resAddForm #parentId").val("顶级菜单");
        $("#resAddForm input[name='parentId']").val("-1");
        $("#dialogSelectParentMenu").modal("hide");
    }
    function showIconSelect(){
        var dialog = ns.view.showModal('$!basePath/system/res/icon', {size:'modal-lg'});
        dialog.finishSelect = finishSelect;
    }
    //弹窗选择图标
    function finishSelect(icon) {
        $("#icon").val(icon);
        $("#iconPreview").attr("class", icon);
    }
    $(function () {
        $('#resAddForm').ajaxForm({
            beforeSubmit: function (arr, $form, options) {
                $form.find("button:submit").button("loading");
            },
            success: function (data, statusText, xhr, $form) {
                if (data.success == true) {
                    Toast.success("菜单修改成功，3秒后返回菜单管理首页", function () {
                        //返回上级菜单
                        window.location.href = "$!basePath/system/res";
                    });
                    setTimeout(function () {
                        //返回上级菜单
                        window.location.href = "$!basePath/system/res";
                    }, 3000);
                } else {
                    Toast.error(data.message);
                    $form.find("button:submit").button("reset");
                }

            }
        });
        //图标样式 实时预览
        $("#icon").on("keyup", function () {
            $("#iconPreview").attr("class", $(this).val());
        });
        //初始化菜单树
        initTreeView();
    });

</script>
#loading_close
</body>
</html>
